<template>
  <div id="iqcOutRecChart" v-loading="loading">
    <!-- 失控记录图表 -->
    <div class="iqcOut-main">
      <el-row>
        <el-col :offset="16" :span="8">
          <span>
            编号：
            <el-input class="code-input-W" type="text" v-model="outRecForm.code"></el-input>
          </span>
        </el-col>
        <el-col :span="24" style="text-align: center; font-size: 18px">
          <p>室内质控失控（警告）处理记录</p>
        </el-col>

        <el-col :span="12">年：{{
            outRecForm.operateDate ? formatDateTime(outRecForm.operateDate, 'yyyy') : ''
          }}</el-col>
        <el-col :span="6" :offset="6">专业组：{{ outRecForm.rptGroupName }}</el-col>
      </el-row>

      <div class="iqcOutTable">
        <el-descriptions :column="9" border>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1" :span="1">
            日期
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3" :span="3">
            <!-- <el-date-picker style="width:100%;" v-model="outRecForm.operateDate" type="datetime" placeholder="选择检验日期" /> -->
            <vxe-input v-model="outRecForm.operateDate" placeholder="日期选择" type="datetime" transfer></vxe-input>

          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1 programNameBorder" :span="1">
            项目名
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass4" :span="4">
            {{ outRecForm.itemDictName ? outRecForm.itemDictName : '' }}
          </el-descriptions-item>
        </el-descriptions>
        <el-descriptions :column="9" border>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1" :span="1">
            仪器名称
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3" :span="3">
            {{ outRecForm.instrName ? outRecForm.instrName : '' }}
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1" :span="1">
            质控品批号
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass4" :span="4">{{ outRecForm.batchNum }}</el-descriptions-item>
        </el-descriptions>

        <el-descriptions :column="9" border>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1" :span="1">
            失控结果
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3" :span="3">
            {{ outRecForm.result ? outRecForm.result : '' }}
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1" :span="1">
            纠正结果
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass4" :span="4">{{ outRecForm.correctResult }}</el-descriptions-item>
        </el-descriptions>

        <el-descriptions :column="9" border>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass2" :span="2">
            失控规则描述
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass7" :span="7">
            <el-checkbox true-label="1" false-label="0" v-model="value.result" v-for="(value, index) in outControlRule" :key="index" @change="checkedChange($event, index, 'outControlRule')">{{ value.lable }}</el-checkbox>
            <el-input type="text" v-model="customVar.outControlRuleDescription"></el-input>
          </el-descriptions-item>

          <el-descriptions-item label-class-name="lableClass" class-name="contentClass2" :span="2">
            警告规则描述
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass7" :span="7">
            <el-checkbox true-label="1" false-label="0" v-model="value.result" v-for="(value, index) in warningRule" :key="index" @change="checkedChange($event, index, 'warningRule')">{{ value.lable }}</el-checkbox>
            <el-input type="text" v-model="customVar.warningRuleDescription"></el-input>
          </el-descriptions-item>

          <el-descriptions-item label-class-name="lableClass" class-name="contentClass2" :span="2">
            报告室内质控负责人
          </el-descriptions-item>
          <el-descriptions-item class-name="contentClass7" :span="7">
            <el-radio-group v-model="customVar.director">
              <el-radio label="1" @click.native.prevent="radioChange('1', 'director')">科室内质控负责人</el-radio>
              <el-radio label="0" @click.native.prevent="radioChange('0', 'director')">科主任</el-radio>
            </el-radio-group>
          </el-descriptions-item>
        </el-descriptions>
        <el-descriptions :column="9" border>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass2" :span="2">
            可能原因
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3" :span="3">
            初步采取的纠正措施
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3" :span="3">
            纠正情况
          </el-descriptions-item>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1" :span="1">
            处理人
          </el-descriptions-item>

          <!-- 可能原因 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass2 check-row-parent" :span="2">
            <div class="check-row" v-for="(value, index) in possibleReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'possibleReason')">{{ value.lable }}</el-checkbox>
            </div>
          </el-descriptions-item>
          <!-- 初步采取的纠正措施 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3 check-row-parent" :span="3">
            <div class="check-row-border" v-for="(value, index) in causeAnalysis" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" @change="checkedChange($event, index, 'causeAnalysis')">{{ value.lable }}</el-checkbox>
            </div>
          </el-descriptions-item>
          <!-- 纠正情况 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass3 check-row-parent" :span="3">
            <div class="check-row-border" v-for="(value, index) in isCorrect" :key="index">
              <el-radio-group v-model="value.result">
                <el-radio label="1" @click.native.prevent="radioChange('1', index, true)">在控</el-radio>
                <el-radio label="0" @click.native.prevent="radioChange('0', index, true)">仍失控</el-radio>
              </el-radio-group>
            </div>
          </el-descriptions-item>
          <!-- 处理人 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass1 check-row-parent" :span="1">
            <div class="check-row-border check-row-input" v-for="(value, index) in personnel" :key="index">
              <el-input type="text" v-model="value.result"></el-input>
            </div>
          </el-descriptions-item>
        </el-descriptions>

        <!-- 最终原因 -->
        <el-descriptions :column="9" border>
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass9" :span="9">
            <span class="input-lable-1">失控的最终原因:</span>
            <el-input type="text" class="input-lable-1-text" v-model="customVar.finalReason"></el-input>
          </el-descriptions-item>
        </el-descriptions>

        <el-descriptions :column="8" border>
          <!-- 试剂 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>试剂：</strong>
            <span class="check-row" v-for="(value, index) in reagentReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'reagentReason')">{{ value.lable }}</el-checkbox>
            </span>
          </el-descriptions-item>

          <!-- 校准品 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>校准品：</strong>
            <span class="check-row" v-for="(value, index) in calibratorReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'calibratorReason')">{{ value.lable }}</el-checkbox>
            </span>
          </el-descriptions-item>

          <!-- 质控品 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>质控品：</strong>
            <span class="check-row" v-for="(value, index) in iqcMaterialReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'iqcMaterialReason')">{{ value.lable }}</el-checkbox>
            </span>
          </el-descriptions-item>

          <!-- 仪器设备 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>仪器设备：</strong>
            <span class="check-row" v-for="(value, index) in insReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'insReason')">{{ value.lable }}</el-checkbox>
            </span>
          </el-descriptions-item>

          <!-- 人员 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>人员：</strong>
            <span class="check-row" v-for="(value, index) in personReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'personReason')">{{ value.lable }}</el-checkbox>
            </span>
          </el-descriptions-item>

          <!-- 环境温度 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>环境温度：</strong>
            <div class="check-row">
              <el-radio-group v-model="customVar.temperature">
                <el-radio label="1" @click.native.prevent="radioChange('1', 'temperature')">高</el-radio>
                <el-radio label="0" @click.native.prevent="radioChange('0', 'temperature')">低</el-radio>
              </el-radio-group>
            </div>
            <div class="check-row"></div>
          </el-descriptions-item>

          <!-- 环境湿度 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>环境湿度：</strong>
            <div class="check-row">
              <el-radio-group v-model="customVar.humidity">
                <el-radio label="1" @click.native.prevent="radioChange('1', 'humidity')">高</el-radio>
                <el-radio label="0" @click.native.prevent="radioChange('0', 'humidity')">低</el-radio>
              </el-radio-group>
            </div>
            <div class="check-row"></div>
          </el-descriptions-item>

          <!-- 水质 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass10 check-row-parent" :span="2">
            <strong>水质：</strong>
            <div class="check-row" v-for="(value, index) in waterQualityReason" :key="index">
              <el-checkbox true-label="1" false-label="0" v-model="value.result" v-if="value.lable" @change="checkedChange($event, index, 'waterQualityReason')">{{ value.lable }}</el-checkbox>
            </div>
          </el-descriptions-item>
        </el-descriptions>

        <el-descriptions :column="9" border>
          <!-- 其他原因 -->
          <el-descriptions-item label-class-name="lableClass" class-name="contentClass9" :span="9">
            <span class="input-lable">其他原因：</span>
            <el-input type="text" v-model="customVar.otherReason"></el-input>
          </el-descriptions-item>

          <!-- 过程描述与纠正措施 -->
          <!-- <el-descriptions-item label-class-name="lableClass" class-name="contentClass9" :span="9">
            <strong>过程描述与纠正措施：</strong>
            <el-input type="textarea" v-model="customVar.descriptionAndMeasure"></el-input>
          </el-descriptions-item> -->

          <el-descriptions-item label-class-name="lableClass" class-name="contentClass9" :span="9">
            <div style="text-indent: 2em">
              失控纠正后，（
              <el-select class="employee-input-W" v-model="customVar.correctionVar" placeholder="请选择">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.label"></el-option>
              </el-select>
              ）进行常规检验
            </div>
            <div>
              如果当天已进行标本检测，应执行失控前标本验证：
              <el-radio-group v-model="customVar.isImplement">
                <el-radio label="1" @click.native.prevent="radioChange('1', 'isImplement')">已执行</el-radio>
                <el-radio label="0" @click.native.prevent="radioChange('0', 'isImplement')">不适用</el-radio>
              </el-radio-group>
            </div>
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <el-row class="bottomRow">
        <el-col>
          <el-form-item label="失控报告人：" prop="outControlRpter">
            <SelectDataList ref="employeeSelectRef" :url="'/api/user/getUserPageList'" :displayField="[
                { title: '编号', props: 'code' }, //列标题
                { title: '名称', props: 'realname' }
              ]" :searchParam="{
                //seachValue: form.hisEmployeeCode
              }" :inputKeyName="'seachValue'" :isPage="true" :placeholder="'点击选择员工'" @selectDataRow="selectEmployeesP1" v-model="customVar.outControlRpter" input-width="180px"/>
          </el-form-item>
        </el-col>
        <el-col >
          <el-form-item label="审核人：" prop="reviewerName">
            <SelectDataList ref="employeeSelectRef" :url="'/api/user/getUserPageList'" :displayField="[
                { title: '编号', props: 'code' }, //列标题
                { title: '名称', props: 'realname' }
              ]" :searchParam="{
                //seachValue: form.hisEmployeeCode
              }" :inputKeyName="'seachValue'" :isPage="true" :placeholder="'点击选择员工'" @selectDataRow="selectEmployeesP2" v-model="outRecForm.reviewerName" input-width="180px"/>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="审核时间：">
          <el-date-picker class="employee-input-W" v-model="outRecForm.reviewDate" type="datetime" placeholder="选择日期时间" align="right" value-format="YYYY-MM-DD HH:mm:ss"></el-date-picker>
        </el-form-item>
        </el-col>
      </el-row>
    </div>
    <div class="footer">
      <el-form :inline="true">
        <el-row>
          <el-col :offset="9">
            <el-form-item>
              <el-button type="primary" @click="save">处理</el-button>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="previewPrint">预览</el-button>
              <el-button type="primary" @click="quietPrint">打印</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>

    <MultiRptPreview :reportList="reportList" :toggle="isPreviewRpt" :modalTitle="'报告预览'" />
    <!-- 静默打印 -->
    <QuietPrint ref="quietPrintRef" :printParams="printParamsObj" />
  </div>
</template>

<script lang="ts" setup>
import { ref, reactive, getCurrentInstance, onMounted } from 'vue';
import VXETable from 'vxe-table';
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage';
import { IsEmpty, TimePickerOpts, DateToString, formatDateTime } from '@/utils/common';
import { AppStore } from '../../../stores/store';
import { isEmpty } from 'lodash';
import SelectDataList from '../../../components/SelectDataList.vue';
import QuietPrint from '@/components/QuietPrint.vue';
import MultiRptPreview from '@/components/MultiRptPreview.vue';

let { proxy }: any = getCurrentInstance();

defineExpose({ initPage, initPageByRecId, initClearDetaAll });

let store = AppStore();
let currentIQCOutId = null;
let currentResultId = null;
let PickerOpts = TimePickerOpts;
const isPreviewRpt = ref(false);
let reportList = reactive([]);
let printParamsObj = ref(null);

let options = [
  {
    label: '可以',
    value: '1'
  },
  {
    label: '不可以',
    value: '0'
  }
];
let loading = ref(false);
let outRecForm = reactive({
  id: null,
  code: '', //编号
  qcResultId: '', //质控结果id
  materialId: '',
  materialItemId: '',
  qcItemId: '',
  instrId: '',
  instrName: '',
  instrCode: '',
  itemDictId: '',
  itemDictName: '',
  itemDictCode: '',
  method: '',
  materialTargetId: '',
  batchNum: '',
  horizontal: '',
  qcNo: '',
  qcDate: '',
  qcSequence: null,
  numResult: null,
  result: '',
  correctResult: '',
  mean: null,
  sd: null,
  z: null,
  rptGroupId: null,
  rptGroup: '',
  rptGroupName: '',
  operateDate: '', //记录时间
  operaterId: store.userInfo.id, //记录人员
  operaterName: '',
  reviewDate: '', //审核时间
  reviewerId: '', //审核员工
  reviewerName: '',
  reviewOpinion: '', //审核意见
  details: []
});

let customVar = reactive({
  outControlRuleDescription: '', //失控规则描述
  warningRuleDescription: '', //警告规则描述
  director: null /* 报告室内质控负责人 科室内质控负责人:1 科主任:0 */,
  finalReason: '' /* 最终原因 */,
  otherReason: '' /* 其他原因 */,
  temperature: null /* 环境温度 */,
  humidity: null /* 环境湿度 */,
  isImplement: null /*是否已执行*/,
  descriptionAndMeasure: '' /* 过程描述和纠正措施 */,
  correctionVar: null, //失控纠正后，（ 变量
  outControlRpter: '', //失控报告人
  outControlRpterId: null, //失控报告人
  reportName: 'IQCOutControlRecChart' //报表名称 用于后期更新格式后，使用原来版本的数据，打印时找到原来使用的版本
});

function initPage(row: any) {
  currentResultId = row.value;
  findIQCOutControlByResultId();
}
function initPageByRecId(row: any) {
  currentIQCOutId = row;
  findIQCOutControlByRecId();
}
function initClearDetaAll() {
  clearDetaAll();
}

// 通过结果id获取失控记录
function findIQCOutControlByRecId() {
  if (IsEmpty(currentIQCOutId)) {
    return;
  }
  loading.value = true;
  const url = '/api/qc/qcOutControlRec/getQcOutControlRecByRecId';
  proxy.$http
    .get(url, { params: { qcRecId: currentIQCOutId } })
    .then((res: any) => {
      if (res.data) {
        const resData = res.data;
        clearDetaAll();
        outRecForm.id = resData.id;
        outRecForm.code = resData.code; //编号
        outRecForm.qcResultId = resData.qcResultId; //质控结果id
        outRecForm.materialId = resData.materialId;
        outRecForm.materialItemId = resData.materialItemId;
        outRecForm.qcItemId = resData.qcItemId;
        outRecForm.instrId = resData.instrId;
        outRecForm.itemDictId = resData.itemDictId;
        outRecForm.instrName = resData.instrName;
        outRecForm.itemDictName = resData.itemDictName;
        outRecForm.method = resData.method;
        outRecForm.materialTargetId = resData.materialTargetId;
        outRecForm.batchNum = resData.batchNum;
        outRecForm.horizontal = resData.horizontal;
        outRecForm.qcNo = resData.qcNo;
        outRecForm.qcDate = resData.qcDate;
        outRecForm.qcSequence = resData.qcSequence;
        outRecForm.numResult = resData.numResult;
        outRecForm.result = resData.result;
        outRecForm.correctResult = resData.correctResult;
        outRecForm.mean = resData.mean;
        outRecForm.sd = resData.sd;
        outRecForm.z = resData.z;
        outRecForm.rptGroupId = resData.rptGroupId;
        outRecForm.rptGroup = resData.rptGroup;
        outRecForm.rptGroupName = resData.rptGroupName;
        outRecForm.operateDate = resData.operateDate; //记录时间
        outRecForm.operaterId = resData.operaterId; //store.userInfo.id, //记录人员
        outRecForm.operaterName = resData.operaterName;
        outRecForm.reviewDate = resData.reviewDate; //审核时间
        outRecForm.reviewerId = resData.reviewerId; //审核员工
        outRecForm.reviewerName = resData.reviewerName;
        outRecForm.reviewOpinion = resData.reviewOpinion; //审核意见
        outRecForm.details = resData.details;

        if (!IsEmpty(outRecForm.details)) {
          outRecForm.details.forEach((item) => {
            const name = item.code.substr(0, item.code.length - 1);
            if (name == 'personnel') {
              personnel[item.code].result = item.result;
            } else if (name == 'outControlRule') {
              outControlRule[item.code].result = item.result;
            } else if (name == 'warningRule') {
              warningRule[item.code].result = item.result;
            } else if (name == 'possibleReason') {
              possibleReason[item.code].result = item.result;
            } else if (name == 'causeAnalysis') {
              causeAnalysis[item.code].result = item.result;
            } else if (name == 'isCorrect') {
              isCorrect[item.code].result = item.result;
            } else if (name == 'reagentReason') {
              reagentReason[item.code].result = item.result;
            } else if (name == 'calibratorReason') {
              calibratorReason[item.code].result = item.result;
            } else if (name == 'iqcMaterialReason') {
              iqcMaterialReason[item.code].result = item.result;
            } else if (name == 'insReason') {
              insReason[item.code].result = item.result;
            } else if (name == 'personReason') {
              personReason[item.code].result = item.result;
            } else if (name == 'waterQualityReason') {
              waterQualityReason[item.code].result = item.result;
            } else {
              customVar[item.code] = item.result;
            }
          });
        }
      }
      loading.value = false;
    })
    .catch((err) => {
      loading.value = false;
      VxeMessage(err, VxeNotifyType.error);
    });
}

// 通过结果id获取失控记录
function findIQCOutControlByResultId() {
  if (IsEmpty(currentResultId)) {
    return;
  }

  loading.value = true;
  const url = '/api/qc/qcOutControlRec/getQcOutControlRecByResultId';
  proxy.$http
    .get(url, { params: { qcResultId: currentResultId } })
    .then((res: any) => {
      if (res.data) {
        const resData = res.data;
        clearDetaAll();
        outRecForm.id = resData.id;
        outRecForm.code = resData.code; //编号
        outRecForm.qcResultId = resData.qcResultId; //质控结果id
        outRecForm.materialId = resData.materialId;
        outRecForm.materialItemId = resData.materialItemId;
        outRecForm.qcItemId = resData.qcItemId;
        outRecForm.instrId = resData.instrId;
        outRecForm.instrName = resData.instrName;
        outRecForm.instrCode = resData.instrCode;
        outRecForm.itemDictId = resData.itemDictId;
        outRecForm.itemDictName = resData.itemDictName;
        outRecForm.itemDictCode = resData.itemDictCode;
        outRecForm.method = resData.method;
        outRecForm.materialTargetId = resData.materialTargetId;
        outRecForm.batchNum = resData.batchNum;
        outRecForm.horizontal = resData.horizontal;
        outRecForm.qcNo = resData.qcNo;
        outRecForm.qcDate = resData.qcDate;
        outRecForm.qcSequence = resData.qcSequence;
        outRecForm.numResult = resData.numResult;
        outRecForm.result = resData.result;
        outRecForm.correctResult = resData.correctResult;
        outRecForm.mean = resData.mean;
        outRecForm.sd = resData.sd;
        outRecForm.z = resData.z;
        outRecForm.rptGroupId = resData.rptGroupId;
        outRecForm.rptGroup = resData.rptGroup;
        outRecForm.rptGroupName = resData.rptGroupName;
        outRecForm.operateDate = resData.operateDate; //记录时间
        outRecForm.operaterId = resData.operaterId; //store.userInfo.id, //记录人员
        outRecForm.operaterName = resData.operaterName;
        outRecForm.reviewDate = resData.reviewDate; //审核时间
        outRecForm.reviewerId = resData.reviewerId; //审核员工
        outRecForm.reviewerName = resData.reviewerName;
        outRecForm.reviewOpinion = resData.reviewOpinion; //审核意见
        outRecForm.details = resData.details;

        if (!IsEmpty(outRecForm.details)) {
          outRecForm.details.forEach((item) => {
            const name = item.code.substr(0, item.code.length - 1);
            if (name == 'personnel') {
              personnel[item.code].result = item.result;
            } else if (name == 'outControlRule') {
              outControlRule[item.code].result = item.result;
            } else if (name == 'warningRule') {
              warningRule[item.code].result = item.result;
            } else if (name == 'possibleReason') {
              possibleReason[item.code].result = item.result;
            } else if (name == 'causeAnalysis') {
              causeAnalysis[item.code].result = item.result;
            } else if (name == 'isCorrect') {
              isCorrect[item.code].result = item.result;
            } else if (name == 'reagentReason') {
              reagentReason[item.code].result = item.result;
            } else if (name == 'calibratorReason') {
              calibratorReason[item.code].result = item.result;
            } else if (name == 'iqcMaterialReason') {
              iqcMaterialReason[item.code].result = item.result;
            } else if (name == 'insReason') {
              insReason[item.code].result = item.result;
            } else if (name == 'personReason') {
              personReason[item.code].result = item.result;
            } else if (name == 'waterQualityReason') {
              waterQualityReason[item.code].result = item.result;
            } else {
              customVar[item.code] = item.result;
            }
          });
        }
      }
      loading.value = false;
    })
    .catch((err) => {
      loading.value = false;
      VxeMessage(err, VxeNotifyType.error);
    });
}

// 单选按钮点击事件
function radioChange(val, radioName, isCot = false) {
  if (isCot) {
    val === isCorrect[radioName].result ? (isCorrect[radioName].result = null) : (isCorrect[radioName].result = val);
  } else {
    val === customVar[radioName] ? (customVar[radioName] = null) : (customVar[radioName] = val);
  }
}
// 多选框change事件
function checkedChange(val, checkedName, varName) {
  this[varName][checkedName].result = val;
}

function selectEmployeesP1(row) {
  customVar.outControlRpter = row.realname;
  customVar.outControlRpterId = row.id;
}
function selectEmployeesP2(row) {
  outRecForm.reviewerId = row.id;
  outRecForm.reviewerName = row.realname;
}
// 保存
function save() {
  console.log(outRecForm);

  const data: any = {};
  Object.assign(data, outRecForm);
  data.details = [];

  // 失控规则描述 outControlRule, 警告规则描述 warningRule, 可能原因 possibleReason, 原因分析过程 causeAnalysis, 纠正情况 isCorrect, 处理人 personnel, 试剂 reagentReason, 校准品 calibratorReason,  质控品 iqcMaterialReason, 仪器设备 insReason, 人员 personReason, 水质 waterQualityReason, 其他变量 customVar
  data.details = data.details.concat(setData(outControlRule));
  data.details = data.details.concat(setData(warningRule));
  data.details = data.details.concat(setData(possibleReason));
  data.details = data.details.concat(setData(causeAnalysis));
  data.details = data.details.concat(setData(isCorrect));
  data.details = data.details.concat(setData(personnel));
  data.details = data.details.concat(setData(reagentReason));
  data.details = data.details.concat(setData(calibratorReason));
  data.details = data.details.concat(setData(iqcMaterialReason));
  data.details = data.details.concat(setData(insReason));
  data.details = data.details.concat(setData(personReason));
  data.details = data.details.concat(setData(waterQualityReason));

  const customVarKeys = Object.keys(customVar);
  customVarKeys.forEach((value) => {
    data.details.push({
      code: value,
      result: customVar[value]
    });
    if (value == 'outControlRpterId') {
      data.operaterId = customVar[value];
    }
  });
  if (isEmpty(data.qcResultId)) {
    VxeMessage('结果为空', VxeNotifyType.error);
    return;
  }

  let url = '/api/qc/qcOutControlRec/saveQcOutControlRec';
  proxy.$http
    .post(url, data)
    .then((res: any) => {
      if (!isEmpty(currentResultId)) {
        findIQCOutControlByResultId();
      } else if (!isEmpty(currentIQCOutId)) {
        findIQCOutControlByRecId();
      }
      loading.value = false;
      VxeMessage('保存成功', VxeNotifyType.success);
    })
    .catch((err) => {
      loading.value = false;
      VxeMessage('保存失败：', VxeNotifyType.error);
    });
}

// 保存的数据处理
function setData(data) {
  const keys = Object.keys(data);
  const dataArr = [];
  keys.forEach((val) => {
    dataArr.push({
      code: val,
      result: data[val].result
    });
  });
  return dataArr;
}

// 失控规则描述
let outControlRule = reactive({
  outControlRule1: {
    lable: '1-3s',
    result: '0'
  },
  outControlRule2: {
    lable: 'R4s',
    result: '0'
  },
  outControlRule3: {
    lable: '2-2s',
    result: '0'
  }
});
// 警告规则描述
let warningRule = reactive({
  warningRule1: {
    lable: '1-2s',
    result: '0'
  },
  warningRule2: {
    lable: '4-1s',
    result: '0'
  },
  warningRule3: {
    lable: '10x',
    result: '0'
  }
});
// 可能原因
let possibleReason = reactive({
  possibleReason1: {
    lable: '操作人员',
    result: '0'
  },
  possibleReason2: {
    lable: '质控品',
    result: '0'
  },
  possibleReason3: {
    lable: '试剂',
    result: '0'
  },
  possibleReason4: {
    lable: '校准品校准',
    result: '0'
  },
  possibleReason5: {
    lable: '仪器设备',
    result: '0'
  },
  possibleReason6: {
    lable: '环境温度湿度',
    result: '0'
  },
  possibleReason7: {
    lable: '水质',
    result: '0'
  },
  possibleReason8: {
    lable: '其他',
    result: '0'
  },
  possibleReason9: {
    lable: '',
    result: '0'
  }
});
// 原因分析过程
let causeAnalysis = reactive({
  causeAnalysis1: {
    lable: '同一质控品重新测定',
    result: '0'
  },
  causeAnalysis2: {
    lable: '换新开瓶质控品重新测定',
    result: '0'
  },
  causeAnalysis3: {
    lable: '换新开瓶试剂重新测定',
    result: '0'
  },
  causeAnalysis4: {
    lable: '用校准品校正该项目后重新测定',
    result: '0'
  },
  causeAnalysis5: {
    lable: '仪器维护后用新质控品重测',
    result: '0'
  },
  causeAnalysis6: {
    lable: '纠正环境条件后重测质控品',
    result: '0'
  },
  causeAnalysis7: {
    lable: '纠正水质后重测质控品',
    result: '0'
  },
  causeAnalysis8: {
    lable: '上报专业组负责人进一步处理',
    result: '0'
  },
  causeAnalysis9: {
    lable: '寻求厂家技术支持',
    result: '0'
  }
});
// 纠正情况
let isCorrect = reactive({
  isCorrect1: {
    result: null
  },
  isCorrect2: {
    result: null
  },
  isCorrect3: {
    result: null
  },
  isCorrect4: {
    result: null
  },
  isCorrect5: {
    result: null
  },
  isCorrect6: {
    result: null
  },
  isCorrect7: {
    result: null
  },
  isCorrect8: {
    result: null
  },
  isCorrect9: {
    result: null
  }
});
// 处理人
let personnel = reactive({
  personnel1: {
    result: ''
  },
  personnel2: {
    result: ''
  },
  personnel3: {
    result: ''
  },
  personnel4: {
    result: ''
  },
  personnel5: {
    result: ''
  },
  personnel6: {
    result: ''
  },
  personnel7: {
    result: ''
  },
  personnel8: {
    result: ''
  },
  personnel9: {
    result: ''
  }
});
// 试剂
let reagentReason = reactive({
  reagentReason1: {
    lable: '气泡',
    result: '0'
  },
  reagentReason2: {
    lable: '变质',
    result: '0'
  },
  reagentReason3: {
    lable: '过期',
    result: '0'
  },
  reagentReason4: {
    lable: '污染',
    result: '0'
  },
  reagentReason5: {
    lable: '误加',
    result: '0'
  },
  reagentReason6: {
    lable: '位置错误',
    result: '0'
  },
  reagentReason7: {
    lable: '不同瓶批号',
    result: '0'
  },
  reagentReason8: {
    lable: '开瓶时间过长',
    result: '0'
  }
});
// 校准品
let calibratorReason = reactive({
  calibratorReason1: {
    lable: '变更',
    result: '0'
  },
  calibratorReason2: {
    lable: '定标时限',
    result: '0'
  },
  calibratorReason3: {
    lable: '配套',
    result: '0'
  },
  calibratorReason4: {
    lable: '变质',
    result: '0'
  },
  calibratorReason5: {
    lable: '试剂批号变更未校准',
    result: '0'
  },
  calibratorReason6: {
    lable: '校准品读数值明显变化',
    result: '0'
  }
});
// 质控品
let iqcMaterialReason = reactive({
  iqcMaterialReason1: {
    lable: '气泡',
    result: '0'
  },
  iqcMaterialReason2: {
    lable: '变质',
    result: '0'
  },
  iqcMaterialReason3: {
    lable: '过期',
    result: '0'
  },
  iqcMaterialReason4: {
    lable: '前处理',
    result: '0'
  },
  iqcMaterialReason5: {
    lable: '保存温度',
    result: '0'
  },
  iqcMaterialReason6: {
    lable: '量不足',
    result: '0'
  },
  iqcMaterialReason7: {
    lable: '误加或位置错误',
    result: '0'
  }
});
// 仪器设备
let insReason = reactive({
  insReason1: {
    lable: '系统准确度漂移',
    result: '0'
  },
  insReason2: {
    lable: '管路原因',
    result: '0'
  },
  insReason3: {
    lable: '维护保养',
    result: '0'
  },
  insReason4: {
    lable: '电路不稳',
    result: '0'
  }
});
// 人员
let personReason = reactive({
  personReason1: {
    lable: '变更',
    result: '0'
  },
  personReason2: {
    lable: '执行',
    result: '0'
  },
  personReason3: {
    lable: '操作步骤',
    result: '0'
  }
});
// 水质
let waterQualityReason = reactive({
  waterQualityReason1: {
    lable: '污染',
    result: '0'
  },
  waterQualityReason2: {
    lable: '电阻率低',
    result: '0'
  }
});
// 初始化所有数据
function clearDetaAll() {
  // 失控规则描述
  outControlRule.outControlRule1.result = '0';
  outControlRule.outControlRule2.result = '0';
  outControlRule.outControlRule3.result = '0';
  // 警告规则描述
  warningRule.warningRule1.result = '0';
  warningRule.warningRule2.result = '0';
  warningRule.warningRule3.result = '0';

  // 可能原因
  possibleReason.possibleReason1.result = '0';
  possibleReason.possibleReason2.result = '0';
  possibleReason.possibleReason3.result = '0';
  possibleReason.possibleReason4.result = '0';
  possibleReason.possibleReason5.result = '0';
  possibleReason.possibleReason6.result = '0';
  possibleReason.possibleReason7.result = '0';
  possibleReason.possibleReason8.result = '0';
  possibleReason.possibleReason9.result = '0';
  // 原因分析过程
  causeAnalysis.causeAnalysis1.result = '0';
  causeAnalysis.causeAnalysis2.result = '0';
  causeAnalysis.causeAnalysis3.result = '0';
  causeAnalysis.causeAnalysis4.result = '0';
  causeAnalysis.causeAnalysis5.result = '0';
  causeAnalysis.causeAnalysis6.result = '0';
  causeAnalysis.causeAnalysis7.result = '0';
  causeAnalysis.causeAnalysis8.result = '0';
  causeAnalysis.causeAnalysis9.result = '0';
  // 纠正情况
  isCorrect.isCorrect1.result = null;
  isCorrect.isCorrect2.result = null;
  isCorrect.isCorrect3.result = null;
  isCorrect.isCorrect4.result = null;
  isCorrect.isCorrect5.result = null;
  isCorrect.isCorrect6.result = null;
  isCorrect.isCorrect7.result = null;
  isCorrect.isCorrect8.result = null;
  isCorrect.isCorrect9.result = null;

  // 处理人
  personnel.personnel1.result = '';
  personnel.personnel2.result = '';
  personnel.personnel3.result = '';
  personnel.personnel4.result = '';
  personnel.personnel5.result = '';
  personnel.personnel6.result = '';
  personnel.personnel7.result = '';
  personnel.personnel8.result = '';
  personnel.personnel9.result = '';
  // 试剂
  reagentReason.reagentReason1.result = '0';
  reagentReason.reagentReason2.result = '0';
  reagentReason.reagentReason3.result = '0';
  reagentReason.reagentReason4.result = '0';
  reagentReason.reagentReason5.result = '0';
  reagentReason.reagentReason6.result = '0';
  reagentReason.reagentReason7.result = '0';
  reagentReason.reagentReason8.result = '0';
  // 校准品
  calibratorReason.calibratorReason1.result = '0';
  calibratorReason.calibratorReason2.result = '0';
  calibratorReason.calibratorReason3.result = '0';
  calibratorReason.calibratorReason4.result = '0';
  calibratorReason.calibratorReason5.result = '0';
  calibratorReason.calibratorReason6.result = '0';
  // 质控品
  iqcMaterialReason.iqcMaterialReason1.result = '0';
  iqcMaterialReason.iqcMaterialReason2.result = '0';
  iqcMaterialReason.iqcMaterialReason3.result = '0';
  iqcMaterialReason.iqcMaterialReason4.result = '0';
  iqcMaterialReason.iqcMaterialReason5.result = '0';
  iqcMaterialReason.iqcMaterialReason6.result = '0';
  iqcMaterialReason.iqcMaterialReason7.result = '0';
  // 仪器设备
  insReason.insReason1.result = '0';
  insReason.insReason2.result = '0';
  insReason.insReason3.result = '0';
  insReason.insReason4.result = '0';
  // 人员
  personReason.personReason1.result = '0';
  personReason.personReason2.result = '0';
  // 水质
  waterQualityReason.waterQualityReason1.result = '0';
  waterQualityReason.waterQualityReason2.result = '0';

  customVar.outControlRuleDescription = ''; //失控规则描述
  customVar.warningRuleDescription = ''; //警告规则描述
  customVar.director = null; /* 报告室内质控负责人 科室内质控负责人:1 科主任:0 */
  customVar.finalReason = ''; /* 最终原因 */
  customVar.otherReason = ''; /* 其他原因 */
  customVar.temperature = null; /* 环境温度 */
  customVar.humidity = null; /* 环境湿度 */
  customVar.isImplement = null; /*是否已执行*/
  customVar.descriptionAndMeasure = ''; /* 过程描述和纠正措施 */
  customVar.correctionVar = null; //失控纠正后，（ 变量
  customVar.outControlRpter = ''; //失控报告人
  customVar.outControlRpterId = null; //失控报告人
  customVar.reportName = 'IQCOutControlRecChart';

  outRecForm.id = null;
  outRecForm.code = ''; //编号
  outRecForm.qcResultId = ''; //质控结果id
  outRecForm.materialId = '';
  outRecForm.materialItemId = '';
  outRecForm.qcItemId = '';
  outRecForm.instrId = '';
  outRecForm.itemDictId = '';
  outRecForm.instrName = '';
  outRecForm.itemDictName = '';
  outRecForm.method = '';
  outRecForm.materialTargetId = '';
  outRecForm.batchNum = '';
  outRecForm.horizontal = '';
  outRecForm.qcNo = '';
  outRecForm.qcDate = '';
  outRecForm.qcSequence = null;
  outRecForm.numResult = null;
  outRecForm.result = '';
  outRecForm.correctResult = '';
  outRecForm.mean = null;
  outRecForm.sd = null;
  outRecForm.z = null;
  outRecForm.rptGroupId = null;
  outRecForm.rptGroup = '';
  outRecForm.rptGroupName = '';
  outRecForm.operateDate = ''; //记录时间
  outRecForm.operaterId = store.userInfo.id; //记录人员
  outRecForm.operaterName = '';
  outRecForm.reviewDate = ''; //审核时间
  outRecForm.reviewerId = ''; //审核员工
  outRecForm.reviewerName = '';
  outRecForm.reviewOpinion = ''; //审核意见
  outRecForm.details = [];
}

//!预览打印
function previewPrint() {
  isPreviewRpt.value = false;
  //先根据路由的URL获取对应的报表信息
  const url = '/api/pubReport/getReportIdByUrl';
  proxy.$http
    .get(url, { params: { url: '/qcoutcontrolrec' } })
    .then((res: any) => {
      const reportId = res.data;
      reportList.length = 0;
      const data = {
        id: !IsEmpty(currentIQCOutId) ? currentIQCOutId : currentResultId,
        reportId: reportId,
        reportTemplateName: '失控上报.rdlx'
      };
      reportList.push(data);
      isPreviewRpt.value = true;
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}
//!静默打印
function quietPrint() {
  //先根据路由的URL获取对应的报表信息
  const url = '/api/pubReport/getReportIdByUrl';
  proxy.$http
    .get(url, { params: { url: '/' + proxy.$route.name } })
    .then((res: any) => {
      const reportId = res.data;
      let arr = [];
      arr.push({
        ReportName: reportId,
        ReportParameters: [{ Name: 'id', Value: currentIQCOutId }],
        PdfPrinterSetting: { PdfPrinterCopies: 1 }
      });
      printParamsObj.value = arr;
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}
</script>

<style lang="scss" scoped>
#iqcOutRecChart {
  height: 100%;
  width: 100%;
  .iqcOut-main {
    width: 800px;
    margin: 0 auto;
    padding-top: 10px;
    padding-bottom: 45px;
  }
  .iqcOutTable {
    border-top: 1px #000 solid;
    border-left: 1px #000 solid;
    margin: 10px 0;
  }
  .el-descriptions {
    :deep(.is-bordered) {
      td {
        border-bottom: 1px #000 solid;
      }
      td[class*='contentClass'] {
        font-size: $font-size;
        color: $font-color-2;
        span {
          font-size: $font-size;
          color: $font-color-2;
        }
      }
    }
    :deep(.lableClass) {
      width: 0;
      // border: none;
    }
    :deep(.el-descriptions__cell) {
      border: none;
    }
    :deep(.contentClass1) {
      width: 12%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass2) {
      width: 23%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass3) {
      width: 32.5%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass4) {
      width: 45%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass6) {
      width: 67.5%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass7) {
      width: 77%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass8) {
      width: 88%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass9) {
      width: 100%;
      border-right: 1px #000 solid;
    }
    :deep(.contentClass10) {
      width: 25%;
      border-right: 1px #000 solid;
    }

    :deep(.is-bordered-label) {
      padding: 0;
    }

    :deep(.check-row-parent) {
      padding: 0;
      > strong {
        font-size: 15px;
        margin: 5px 1em 0;
      }
      > .check-row-border {
        height: 30px;
        line-height: 30px;
        border-bottom: 1px #000 solid;
        padding: 0 10px;
        box-sizing: border-box;
      }
      > div:last-child {
        border-bottom: none;
      }

      .check-row-input {
        padding: 0;
        .el-input {
          width: 100%;
        }
      }
    }

    .el-input {
      width: 100%;
      height: 27px;
      line-height: 27px;
      :deep(.el-input__wrapper) {
        box-shadow: none;
      }
      :deep(.el-input__inner) {
        height: 27px;
        line-height: 27px;
        padding: 0 4px;
        border: none;
      }
    }

    .check-row-parent > .check-row {
      height: 30px;
      line-height: 30px;
      padding: 0 10px;
      box-sizing: border-box;
    }

    // 输入框
    .input-lable {
      display: inline-block;
      width: 80px;
    }
    .input-lable-1 {
      display: inline-block;
      width: 110px;
    }
    .el-input {
      width: calc(100% - 80px);
    }
    .input-lable-1-text {
      width: calc(100% - 110px);
    }
    strong {
      display: block;
    }
  }
  .bottomRow {
    display: flex;
    align-items: center;
    justify-content: center;
    .el-col {
      margin-right: 5px;
      flex: 1;
      .el-input {
        width: 180px;
      }
      :deep(.el-input__wrapper){
        width: 180px !important;
      }
    }
  }

  .employee-input-W {
    text-indent: 0;
    width: 150px;
    .el-input {
      width: 150px;
    }
    .el-input__inner {
      padding: 0 4px;
    }
  }

  .code-input-W {
    width: calc(100% - 60px);
    :deep(.el-input__wrapper) {
      box-shadow: none;
    }
    :deep(.el-input__inner) {
      padding: 0 4px;
      border: none;
    }
  }

  .footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 5px 0;
    box-shadow: 8px 8px 15px #909399;
    background-color: $bg-gray;
    z-index: 9999;
    .el-form {
      transform: translateX(5%);
    }
    .el-form-item {
      margin-bottom: 0;
      margin-right: 12px;
    }
  }
}
</style>
